<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <title>AK - Sign In</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="./assets/css/app.css" rel="stylesheet" />
    <link href="./assets/css/themes/1/conf-room1.min.css" rel="stylesheet" />
    <link href="./assets/css/themes/1/jquery.mobile.icons.min.css" rel="stylesheet" />
    <link href="./assets/jquery.mobile.structure-1.4.5.min.css" rel="stylesheet" />
    <script src="./assets/lib/jquery-2.1.3.min.js"></script>
    <script src="./assets/jquery.mobile-1.4.5.min.js"></script>
</head>

<body>
    <div data-role="page">
        <div data-role="header" data-theme="a">
            <button class="ui-btn ui-icon-home ui-btn-icon-left ui-shadow ui-corner-all">Back</button><h1>AK</h1>
        </div><!-- /header -->
        <div role="main" class="ui-content">
            <h3>Sign In</h3>
            <label for="txt-email">Email Address</label>
            <input type="text" name="txt-email" id="txt-email" value="">
            <label for="txt-password">Password</label>
            <input type="password" name="txt-password" id="txt-password" value="">
            <fieldset data-role="controlgroup">
                <input type="checkbox" name="chck-rememberme" id="chck-rememberme" checked="">
                <label for="chck-rememberme">Remember me</label>
            </fieldset>
            <a href="#dlg-invalid-credentials" data-rel="popup" data-transition="pop" data-position-to="window" id="btn-submit" class="ui-btn ui-btn-b ui-corner-all mc-top-margin-1-5">Submit</a>
            <p class="mc-top-margin-1-5"><a href="password-reset">Can't access your account?</a></p>
            <div data-role="popup" id="dlg-invalid-credentials" data-dismissible="false" style="max-width:400px;">
                <div role="main" class="ui-content">
                    <h3 class="mc-text-danger">Login Failed</h3>
                    <p>Did you enter the right credentials?</p>
                    <div class="mc-text-center"><a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-b mc-top-margin-1-5">OK</a></div>
                </div>
            </div>
        </div><!-- /content -->
    </div><!-- /page -->
</body>
</html>
